@keyframes slideUp {
    0% {
      bottom:-40%;
    }
    100% {
      bottom:0;
    }
  }
  @-moz-keyframes slideUp {
    0% {
      bottom:-40%;
    }
    100% {
      bottom:0;
    }
  }
  @-webkit-keyframes slideUp {
    0% {
      bottom:-40%;
    }
    100% {
      bottom:0;
    }
  }
  @-o-keyframes slideUp {
    0% {
      bottom:-40%;
    }
    100% {
      bottom:0;
    }
  }
  .pickerView-wrap * {
      margin:0;
      padding:0;
      list-style: none;
      -webkit-box-sizing: border-box;
      -ms-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing: border-box;
      font-size: 0;
  }
  .pickerView-wrap {
      position: fixed;
      left:0;
      top:0;
      height:100%;
      width:100%;
  }
  .pickerView-mask {
      height:100%;
      width:100%;
      background:rgba(0,0,0,.4);
  }
  .pickerView-box {
      height:40%;
      width:100%;
      position: absolute;
      left:0;
      bottom:0;
      background: #fff;
      padding-top:45px;
      animation: slideUp 0.3s;
  }
  .pickerView-box-header {
      text-align: center;
      height:45px;
      border-bottom:1px solid #ddd;
      width:100%;
      padding:0 50px;
      position: absolute;
      left:0;
      top:0;
      z-index: 10;
      background: #fff;
  }
  .pickerView-box-header>div {
      line-height: 44px;
      font-size: 16px;
  }
  .pickerView-box-header-btn {
      height:100%;
      width:50px;
      position: absolute;
      top:0;
      color:#108ee9;
  }
  .pickerView-box-header-left {
      left:0;
  }
  .pickerView-box-header-right {
      right:0;
  }
  .pickerView-box-header-title {
      text-align: center;
      height:100%;
      width:100%;
      overflow:hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
  }
  .pickerView-box-content-wrap {
      height:100%;
      width:100%;
      overflow: hidden;
      position: relative;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
  }
  .pickerView-box-content {
      -webkit-box-flex: 1;
      -webkit-flex: 1;
      -ms-flex: 1;
      flex: 1;
      position: relative;
  }
  .pickerView-box-content-mask {
      position: absolute;
      left: 0;
      bottom:0;
      height: 100%;
      margin: 0 auto;
      width: 100%;
      z-index: 3;
      background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)), -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6));
      background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.95)), to(rgba(255, 255, 255, 0.6))), -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0.95)), to(rgba(255, 255, 255, 0.6)));
      background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)), linear-gradient(to top, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6));
      background-position: top, bottom;
      background-size: 100% 102px;
      background-repeat: no-repeat;
  }
  .pickerView-box-content-indicator {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      width: 100%;
      height: 34px;
      position: absolute;
      left: 0;
      top: 102px;
      z-index: 3;
      border-top: 1PX solid #ddd;
      border-bottom: 1PX solid #ddd;
  }
  .pickerView-items {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      z-index: 1;
      padding: 102px 0;
      padding: 102px 0px;
  }
  .pickerView-item {
      touch-action: manipulation;
      text-align: center;
      font-size: 16px;
      height: 34px;
      line-height: 34px;
      color: #000;
      overflow:hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
  }